<form class="daoyxx-wrap" enctype="multipart/form-data" method="post" action="/guider/update_guider_info/<{$user.uid}>">

    <h2 class="title">个人头像</h2>

    <div class="upload">
        <div class="img-wrap">
            <img <{if $user.userIcon=='' and $user.userGender==''}>src="/resource/www/imgs/default_tx.png" 
                 <{elseif $user.userIcon=='' and $user.userGender=='m'}>src="/upload/upload/images/nousericon-m.png"
                 <{elseif $user.userIcon=='' and $user.userGender=='f'}>src="/upload/upload/images/nousericon-f.png"
                 <{else}>src="<{$user.userIcon}>"
                 <{/if}>
id="imgId" class="img">
        </div>
        <div class="content">
            <p class="text">清楚的脸部正面照对导游和游客了解彼此起着重大作用，请上传一张能清楚看到您脸部的照片。</p>
            <div class="file">
                <input type="file" id="userHeadImg" value="" name="userIcon">点击编辑您的头像
            </div>
        <div class="img-right" style="top:20px;">
       <img src="/upload/upload/images/guide_info_upload_right.png">
       </div>
       <div class="img-wrong" style="top:-80px;">
       <img src="/upload/upload/images/guide_info_upload_wrong.png">
       </div>    

        </div>
    </div>

    <input type="hidden" name="uid" value="<{$uid}>">

    <h2 class="title">个人信息</h2>

    <ul class="daoyxx">

        <li class="li fix">
            <span class="left">姓氏</span>
            <input type="text" class="text" name="userFamily" placeholder="请填写姓氏" value="<{$user.userFamily}>">
            <span class="right">名字</span>
            <input type="text" class="text" name="userName" placeholder="请填写名字" value="<{$user.userName}>">
        </li>

        <li class="li fix">
            <span class="left">性别</span>
            <select name="userGender" id="" class="text">
                <option value="-1">请选择性别</option>
                <option value="m" <{if $user.userGender == 'm'}>selected<{/if}>>男</option>
                <option value="f" <{if $user.userGender == 'f'}>selected<{/if}>>女</option>
            </select>
            <span class="right">年龄</span>
            <select name="userAge" id="" class="text">
                <option value="-1">请选择年龄</option>
                <option value="70后" <{if $user.userAge == '70后'}>selected<{/if}>>70后</option>
                <option value="80后" <{if $user.userAge == '80后'}>selected<{/if}>>80后</option>
                <option value="90后" <{if $user.userAge == '90后'}>selected<{/if}>>90后</option>
                <option value="00后" <{if $user.userAge == '00后'}>selected<{/if}>>00后</option>
            </select>
        </li>

        <li class="li fix">
            <span class="left">国籍</span>
            <div>
                <input type="text" class="text" name="nationality" placeholder="请填写您的国籍" value="<{$user.nationality}>">
            </div>
            <span class="lang">语言<br>(多选)</span>
            <label class="choose">
                <input type="checkbox" name="language[]" <{if '1'|in_array:$user.language}>checked<{/if}>  value="1">普通话
            </label>
            <label class="choose">
                <input type="checkbox" name="language[]" <{if '2'|in_array:$user.language}>checked<{/if}> value="2">法语
            </label>
            <label class="choose">
                <input type="checkbox" name="language[]" <{if '3'|in_array:$user.language}>checked<{/if}> value="3">英语
            </label> 
        </li>

        <li class="li fix">
            <span class="left">自我介绍</span>
            <textarea class="textarea" placeholder="0-200字" name="introduction"><{$user.introduction}></textarea>
        </li>

        <li class="li fix">
            <span class="left">居住城市</span>
            <input type="text" class="text" name="resideCity" placeholder="请输入你居住的城市" value="<{$user.resideCity}>">
            <span class="shijian">居住时间</span>
            <select name="resideTime" class="sj">
                <option value="">请选择居住时间</option>
                <option value="1" <{if $user.resideTime == 1}>selected<{/if}>>1年</option>
                <option value="2" <{if $user.resideTime == 2}>selected<{/if}>>2年</option>
                <option value="3" <{if $user.resideTime == 3}>selected<{/if}>>3年</option>
                <option value="4" <{if $user.resideTime == 4}>selected<{/if}>>4年</option>
                <option value="5" <{if $user.resideTime == 5}>selected<{/if}>>5年以上</option>
            </select>
        </li>
        <!--<li class="li fix">
            <span class="left">联系电话</span>
            <select name="telcode" style="width:100px;height:40px;float:left;margin-right:10px;border:1px solid #dcdcdc;text-align:center">
  <option value="-1">国家区号</option>
                    <option value="+86" <{if $user.telCode=="+86"}>selected<{/if}> >中国(+86)</option>
                    <option value="+33" <{if $user.telCode=="+33"}>selected<{/if}> >法国(+33)</option>
  </select>
             <input type="text" class="xiangxi" name="userPhone" placeholder="手机号码如果首位数字为0请去掉数字0" style="width:480px;" value="<{$user.userPhone}>">
        </li>-->
        <li class="li fix">
            <span class="left">居住地址</span>
            <input type="text" class="xiangxi" name="addr" placeholder="详细地址" value="<{$user.addr}>">
        </li>
        <li class="li fix">
            <span class="left"></span>
            <input type="text" class="xiangxi" name="rcity" placeholder="城市" value="<{$user.rcity}>">
        </li>

        <li class="li fix">
            <span class="left"></span>
            <input type="text" class="xiangxi" name="code" placeholder="邮编" value="<{$user.code}>">
        </li>

        <li class="li fix">
            <span class="left"></span>
            <input type="text" class="xiangxi" name="country" placeholder="国家" value="<{$user.country}>">
        </li>

    </ul>

    <p class="prompt">此信息仅用于推送导游奖励和与哇吖有关的材料，为了便于与您的交流，哇吖强烈建议您填写</p>

    <input class="submit" type="submit" value="保存" onclick="return submit_form();">

</form>

<script>

function submit_form(){

//    if($('input:file[name="userIcon"]').val() == ''){
//       layer.msg('头像不能为空');
//       return false;
//    }

    var oUserFamily = $("input:text[name='userFamily']").val();
    if (!$.trim(oUserFamily)) {
        layer.msg('姓氏不能为空');
        return false;
    }

    var oUserName = $("input:text[name='userName']").val();
    if (!$.trim(oUserName)) {
        layer.msg('名字不能为空');
        return false;
    }

    var oUserGender = $("select[name='userGender']").val();
    if (oUserGender == -1) {
        layer.msg('请选择性别');
        return false;
    }

    var oUserAge = $("select[name='userAge']").val();
    if (oUserAge == -1) {
        layer.msg('请选择年龄');
        return false;
    }

    var oNationality = $("input:text[name='nationality']").val();
    if (!$.trim(oNationality)) {
        layer.msg('国籍不能为空');
        return false;
    }

    if (!$("input:checkbox[name='language[]']").is(':checked')) {
        layer.msg('语言不能为空');
        return false;
    }

    var oIntroduction = $("textarea[name='introduction']").val();
    if (!$.trim(oIntroduction)) {
        layer.msg('自我介绍不能为空');
        return false;
    }
    var introlength =$.trim(oIntroduction).length;
    if (introlength > 300) {
        layer.msg('自我介绍过长');
        return false;
    }
    var oResideCity = $("input:text[name='resideCity']").val();
    if (!$.trim(oResideCity)) {
        layer.msg('请填写居住城市');
        return false;
    }

    var oResideTime = $("select[name='resideTime']").val();
    if (!$.trim(oResideTime)) {
        layer.msg('请填写居住时间');
        return false;
    }

/*    var oAddr = $("input:text[name='addr']").val();
    if (!$.trim(oAddr)) {
        layer.msg('请填写详细地址');
        return false;
    }

    var oUserPhone = $("input:text[name='userPhone']").val();

//    var oUserPhoneReg =  /^[0-9]*[1-9][0-9]*$/.test($.trim(oUserPhone));

    if (!$.trim(oUserPhone)) {
        layer.msg('请输入电话号码');
        return false;
    }
    
    var oTelcode = $("select[name='telcode']").val();
    if (oTelcode == -1) {
        layer.msg('请选择国家区号');
        return false;
    }

    var oRcity = $("input:text[name='rcity']").val();
    if (!$.trim(oRcity)) {
        layer.msg('请填写城市');
        return false;
    }

    var oCode = $("input:text[name='code']").val();

    if (!$.trim(oCode)) {
        layer.msg('请输入邮编');
        return false;
    }

    var oCountry = $("input:text[name='country']").val();
    if (!$.trim(oCountry)) {
        layer.msg('请填写国家');
        return false;
    }*/
}

</script>

<script>
    $("#userHeadImg").change(function(event) {
        var file = $(event.target)[0].files[0];
        var src = URL.createObjectURL(file);
        if(file){
            $("#imgId").attr('src',src)
        }else{
            $("#imgId").attr('src',"<{$user.userIcon}>")
        }
    });

    $(".info").addClass("active");
</script>

</script>
